<template>
    <el-dialog v-if="dialogVisible" :close-on-click-modal='false' title="批量预算" top="5vh" :visible.sync="dialogVisible" @close="resetForm('bulkBidRef')" width="900px">
        <el-form label-position="top" label-width="auto" size="small" :hide-required-asterisk='true' :model="bulkBidForm" :rules="bulkBidRules" class="elForm" ref="bulkBidRef">
            <el-form-item label="需求数量" prop="number">
                <el-input-number v-model="bulkBidForm.number" controls-position="right" @change="calEqual" :min="1" :max="maxNumber" style="width:200px"></el-input-number>
            </el-form-item>
            <el-form-item label="模板名称" prop="name">
                <el-input v-model="bulkBidForm.name" placeholder="" style="width:200px"></el-input>
            </el-form-item>
            <el-form-item label="预算设置" prop="material_addr">
                <div class="flexbox flexcenter">
                    <el-form-item label="" prop="">
                        <el-select v-model="bulkBidForm.set_type" placeholder="" @change="selectSet" style="width:120px">
                            <el-option label="固定设置" value="1"></el-option>
                            <el-option label="等差设置" value="2"></el-option>
                            <el-option label="等比设置" value="3"></el-option>
                        </el-select>
                    </el-form-item>
                    <div class="flexbox flexcenter" v-if="bulkBidForm.set_type==1" key="fixed">
                        <el-form-item label="" prop="fixed_value" class="ml">
                            <el-input placeholder="" v-model="bulkBidForm.fixed_value" @change="calEqual" style="width:230px">
                                <template slot="prepend">固定值</template>
                                <template slot="append">USD</template>
                            </el-input>
                        </el-form-item>
                    </div>
                    <div v-else-if="bulkBidForm.set_type==2" class="flexbox flexcenter" key="equal">
                        <el-form-item label="" prop="fixed_value" class="ml">
                            <el-input placeholder="" v-model="bulkBidForm.fixed_value" style="width:220px" @input="calEqual">
                                <template slot="prepend">最小值</template>
                                <template slot="append">USD</template>
                            </el-input>
                        </el-form-item>
                        <el-form-item label="" prop="equal_value" class="ml">
                            <el-input placeholder="" v-model="bulkBidForm.equal_value" style="width:220px" @input="calEqual">
                                <el-select v-model="bulkBidForm.equal_type" slot="prepend" @change="seletEqual" class="equal_select" placeholder="请选择">
                                    <el-option label="差值" :value="1"></el-option>
                                    <el-option label="最大值" :value="2"></el-option>
                                </el-select>
                                <template slot="append">USD</template>
                            </el-input>
                        </el-form-item>
                        <div class="ml font_14 color_01">
                            <span v-if="bulkBidForm.equal_type==1" key="max">
                                最大值
                            </span>
                            <span v-else-if="bulkBidForm.equal_type==2" key="min">
                                差值
                            </span>
                            ：{{is_value}}USD
                        </div>
                    </div>
                    <div v-else-if="bulkBidForm.set_type==3" class="flexbox flexcenter" key="ratio">
                        <el-form-item label="" prop="fixed_value" class="ml">
                            <el-input placeholder="" v-model="bulkBidForm.fixed_value" @input="calEqual" style="width:220px">
                                <template slot="prepend">最小值</template>
                                <template slot="append">USD</template>
                            </el-input>
                        </el-form-item>
                        <el-form-item label="" prop="ratio_value" class="ml">
                            <el-input placeholder="" v-model="bulkBidForm.ratio_value" @input="calEqual" style="width:220px">
                                <el-select v-model="bulkBidForm.ratio_type" slot="prepend" class="equal_select" placeholder="请选择">
                                    <el-option label="增长率" :value="1"></el-option>
                                </el-select>
                                <template slot="append">%</template>
                            </el-input>
                        </el-form-item>
                        <div class="ml font_14 color_01">最大值：{{is_value}}USD</div>
                    </div>
                    <el-button type="primary" class="ml" :disabled='disabled' @click="submitForm('bulkBidRef')">应用设置</el-button>
                </div>
            </el-form-item>
        </el-form>
        <el-table :data="tableData" max-height="350" class="com_table">
            <el-table-column prop="delname" label="模板名称">
            </el-table-column>
            <el-table-column prop="budget" label="预算">
            </el-table-column>
        </el-table>
        <span slot="footer" class="dialog-footer">
            <el-button @click="resetForm('bulkBidRef')" class="el-button-width" size="small">取 消</el-button>
            <el-button type="primary" @click="addList()" class="el-button-width" size="small">确 定</el-button>
        </span>
    </el-dialog>
</template>

<script>
export default {
    props: ["dataForm"],
    name: "",
    data() {
        var checkFixed = (rule, value, callback) => {
            let ref =
                /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;
            if (!ref.test(value)) {
                return callback(new Error("请输入正确的数值"));
            } else if (value < 20) {
                return callback(new Error("最小值不能低于20元"));
            } else {
                callback();
            }
        };
        var checkEqual = (rule, value, callback) => {
            let ref =
                /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;
            if (!ref.test(value)) {
                return callback(new Error("请输入正确的数值"));
            } else if (value < 0.01) {
                return callback(new Error("最小值不能低于0.01元"));
            } else {
                callback();
            }
        };
        var checkRatio = (rule, value, callback) => {
            let ref = /^([1-9][0-9]*)$/;
            if (!ref.test(value)) {
                return callback(new Error("请输入大于0的正整数值"));
            } else {
                callback();
            }
        };
        return {
            disabled: false,
            dialogVisible: false,
            is_value: 0,
            tableData: [],
            develyInfo: {},
            maxNumber: 10,
            bulkBidForm: {
                set_type: "2",
                name: "模板名称",
                number: 0,
                fixed_value: 20,
                min_value: 1,
                equal_type: 1,
                equal_value: 20,
                ratio_type: 1,
                ratio_value: 1,
            },
            bulkBidRules: {
                name: [
                    {
                        required: true,
                        message: "请输入模板名称",
                        trigger: ["blur", "change"],
                    },
                ],
                fixed_value: [
                    {
                        validator: checkFixed,
                        trigger: ["blur", "change"],
                    },
                ],
                equal_value: [
                    {
                        validator: checkEqual,
                        trigger: ["blur", "change"],
                    },
                ],
                ratio_value: [
                    {
                        validator: checkRatio,
                        trigger: ["blur", "change"],
                    },
                ],
            },
        };
    },

    created() {
        // this.getData();
    },
    methods: {
        getData() {
            this.dialogVisible = true;
            this.bulkBidForm.number =
                20 - this.dataForm.adgroup.delivery.length;
            this.maxNumber = 20 - this.dataForm.adgroup.delivery.length;
            this.calEqual();
        },
        // 选择设置
        selectSet() {
            this.calEqual();
        },

        // 选择插值
        seletEqual() {
            if (this.bulkBidForm.equal_type == 1) {
                this.bulkBidForm.equal_value = 0.01;
            } else if (this.bulkBidForm.equal_type == 2) {
                this.bulkBidForm.equal_value = this.bulkBidForm.fixed_value;
            }
            this.calEqual();
        },

        // 数值设置
        calEqual() {
            if (this.bulkBidForm.set_type == 2) {
                if (this.bulkBidForm.equal_type == 1) {
                    this.is_value = (
                        Number(this.bulkBidForm.equal_value) *
                            (Number(this.bulkBidForm.number) - 1) +
                        Number(this.bulkBidForm.fixed_value)
                    ).toFixed(2);
                } else if (this.bulkBidForm.equal_type == 2) {
                    if (
                        Number(this.bulkBidForm.fixed_value) >
                        Number(this.bulkBidForm.equal_value)
                    ) {
                        this.$message.error("最大值不能小于最小值");
                        this.disabled = true;
                    } else {
                        this.disabled = false;
                        this.is_value = (
                            (Number(this.bulkBidForm.equal_value) -
                                Number(this.bulkBidForm.fixed_value)) /
                            (Number(this.bulkBidForm.number) - 1)
                        ).toFixed(2);
                    }
                }
            } else if (this.bulkBidForm.set_type == 3) {
                if (this.bulkBidForm.ratio_type == 1) {
                    let num = this.bulkBidForm.number - 1;
                    let value = Number(this.bulkBidForm.fixed_value);
                    for (let i = 0; i < num; i++) {
                        value +=
                            Number(value) *
                            (Number(this.bulkBidForm.ratio_value) / 100);
                    }
                    this.is_value = value.toFixed(2);
                }
            }
            this.$nextTick(() => {
                this.submitForm("bulkBidRef");
            });
        },

        // 提交添加
        submitForm(formName) {
            this.$refs[formName].validate(async (valid) => {
                if (valid) {
                    let tableValue = [];
                    let num = this.bulkBidForm.number;
                    if (this.bulkBidForm.set_type == 1) {
                        for (let i = 0; i < num; i++) {
                            tableValue.push({
                                delname:
                                    this.bulkBidForm.name +
                                    Number(
                                        this.bulkBidForm.fixed_value
                                    ).toFixed(2),
                                budget: Number(
                                    this.bulkBidForm.fixed_value
                                ).toFixed(2),
                            });
                        }
                        this.tableData = tableValue;
                    } else if (this.bulkBidForm.set_type == 2) {
                        if (this.bulkBidForm.equal_type == 1) {
                            let total = Number(this.bulkBidForm.fixed_value);
                            let equal = this.bulkBidForm.equal_value;
                            for (let i = 0; i < num; i++) {
                                total += Number(equal);
                                tableValue.push({
                                    delname:
                                        this.bulkBidForm.name +
                                        Number(total).toFixed(2),
                                    budget: Number(total).toFixed(2),
                                });
                            }
                            this.tableData = tableValue;
                        } else if (this.bulkBidForm.equal_type == 2) {
                            let total = Number(this.bulkBidForm.fixed_value);
                            let equal = this.is_value;
                            for (let i = 0; i < num; i++) {
                                total += Number(equal);
                                tableValue.push({
                                    delname:
                                        this.bulkBidForm.name +
                                        Number(total).toFixed(2),
                                    budget: Number(total).toFixed(2),
                                });
                            }
                            this.tableData = tableValue;
                        }
                    } else if (this.bulkBidForm.set_type == 3) {
                        let total = Number(this.bulkBidForm.fixed_value);
                        for (let i = 0; i < num; i++) {
                            total +=
                                Number(total) *
                                (Number(this.bulkBidForm.ratio_value) / 100);
                            tableValue.push({
                                delname:
                                    this.bulkBidForm.name +
                                    Number(total).toFixed(2),
                                budget: Number(total).toFixed(2),
                            });
                        }
                        this.tableData = tableValue;
                    }
                } else {
                    this.loading = false;
                    return false;
                }
            });
        },

        // 添加列表
        addList() {
            if (this.tableData.length == 0) {
                this.$message.error("请先设置预算");
                return;
            }
            for (let i in this.tableData) {
                let arr = {
                    budget: this.tableData[i].budget,
                    delname: this.tableData[i].delname,
                    budget_mode: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].budget_mode,
                    schedule_type: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].schedule_type,
                    schedule_start_time: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].schedule_start_time,
                    schedule_end_time: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].schedule_end_time,
                    dayparting_type:this.dataForm.adgroup.delivery[this.dataForm.delivery_index].dayparting_type,
                    dayparting:this.dataForm.adgroup.delivery[this.dataForm.delivery_index].dayparting,
                    optimization_goal: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].optimization_goal,
                    optimization_event: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].optimization_event,
                    deep_bid_type: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].deep_bid_type,
                    roas_bid: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].roas_bid,
                    bid_type: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].bid_type,
                    bid_price: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].bid_price,
                    conversion_bid_price: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].conversion_bid_price,
                    pacing: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].pacing,
                    billing_event: this.dataForm.adgroup.delivery[this.dataForm.delivery_index].billing_event,
                }
                this.dataForm.adgroup.delivery.push(arr)
            }
            this.sessionSave();
            this.resetForm("bulkBidRef")
        },
        sessionSave(){
            this.$emit("sessionSave")
        },
        // 关闭重置表单
        resetForm(formName) {
            this.$refs[formName].resetFields();
            this.dialogVisible = false;
        },
    },
};
</script>
<style scoped>
.com_table {
    margin-top: 10px;
}
.ml {
    margin-left: 15px;
}
</style>
<style>
.equal_select.el-select .el-input {
    width: 90px;
}
</style>

